 <template>
    <div class="unused">
        <div class="raise-search-seek">
            <i class="icon-sousuo iconfont"></i>
            <input type="text" placeholder="搜索需要帮助的服务" class="b-e b-0" v-model="inputContent" @keyup="search">
        </div>

        <div>
            <ul>
                <li v-for="(list, index) in showList">
                    <div class="width-75">
                        <div class="m-t-28 flex">
                            <!--头像、名字和学校-->
                            <div class="row">
                                <div>
                                    <img :src="list.userTo.portrait" alt="" class="portrait">
                                </div>
                                <div class="m-l-14">
                                    <h2 class="fs-36 c-3">{{list.userTo.nickName}}</h2>
                                    <p class="fs-24 c-3 m-t-18">{{list.name}}</p>
                                </div>
                            </div>
                        </div>
                        <router-link :to="{path:'/unusedDetails',query:{id:list.goodsId}}">
                            <div>
                                <span class="fs-30 l-h-4">
                                    <span class="c-f3 f-w">￥{{list.price}} &nbsp;</span>
                                    {{list.caption}}
                                </span>
                            </div>
                            <div>
                                <img v-for="imgs in showList[index].images" :src="imgs" alt="" class="unused-img">
                            </div>
                        </router-link>
                    </div>
                    <div class="index-blank m-t-18">
                    </div>
                </li>
            </ul>
        </div>  
    </div>
</template>
<script>
import { allDate,f } from '../../assets/js/common'

export default {
    data() {
        return {
            inputContent:"",
            showList:[],
        };
    },
    methods: {

        search(){
            var params = new URLSearchParams();            
            params.append("caption", this.inputContent);
            params.append("school.schoolId", localStorage.schoolId);

            this.$http({
                method: 'post',
                url: localPath + '/goods/goodsPageSearch',
                data:params
            }).then((data)=>{
                // var arr =  data.data;
                // for (let i = 0; i < data.data.message.rows.length; i++) {
                //     //将时间转换一下
                //     data.data.message.rows[i].createTime = allDate(data.data.message.rows[i].createTime);
                //     //图片可能不是一张通过split
                //     if (data.data.message.rows[i].images == "" || data.data.message.rows[i].images == null) {

                //     } else {
                //         data.data.message.rows[i].images = data.data.message.rows[i].images.split(",");
                //     }
                // }
                this.showList = data.data.message.rows;

                console.log(this.showList);
            }).cahch((error)=>{
                console.log(error);
            })
        }
         
          
    },
    mounted() {
        
         document.addEventListener(f());
    },
    watch:{
        selected() {   //this.selected不等于默认的1的时候就发生改变 就调用loadMire的这个函数
            this.loadMore();
        }
    },
    directives: {
        tap: {
            // 指令的定义
            inserted: function(el) {
                el.focus()
            }
        }
    }
};
</script>
<style>
.unused-seek {
    width: 7rem;
    height: .5rem;
    margin: .2rem auto;
    padding: 0 .2rem;
    border-radius: 5px;
    border: 1px solid #333333;
    background-color: #ffffff;
}

.mint-cell-wrapper {
    padding: 0px 0px;
}

.unused-img {
    width: 2.6rem;
    height: 2.6rem;
    margin: .3rem 0 0 .12rem;
}
 

.raise-search-seek {
    width: 7rem;
    height: .5rem;
    margin: .2rem auto;
    padding: 0 .2rem;
    border-radius: 5px;
    background-color: #eeeeee;
}
</style>

